<template>
    <div class="service_box">
          <!-- 标题 -->
          <div class="server_titleBox">
                <div class="server_title">
                      <span class="line"></span>
                      <span class="main_titles">服务大厅</span>
                      <span class="line"></span>
                </div>
                <p class="under_title">Service hall</p>
          </div>
            <!-- 服务切换 -->
          <a-tabs defaultActiveKey="1" class="serviceChange">
              <a-tab-pane tab="物流运输服务" key="1">
                  <ul>
                    <li>
                        <img src="./../../../static/img/index/gongluyunshufuwu.png" alt="">
                        <div class="img_detail">
                        <p>公路运输服务</p>
                        <div>
                            <nuxt-link to="./../transport/highway?transType=31">整车</nuxt-link>
                            <nuxt-link to="./../transport/highway?transType=32">零担</nuxt-link>
                            <nuxt-link to="./../transport/highway?transType=33">冷链</nuxt-link>
                        </div>
                      </div>
                    </li>
                    <li>
                        <img src="./../../../static/img/index/tieluyunshufuwu.png" alt="">
                        <div class="img_detail">
                        <p>铁路运输服务</p>
                        <div>
                            <nuxt-link to="./../transport/railway?transType=34">普货</nuxt-link>
                            <nuxt-link to="./../transport/railway?transType=35">高铁</nuxt-link>
                            <nuxt-link to="./../transport/railway?transType=36">冷链</nuxt-link>
                        </div>
                      </div>
                    </li>
                    <li>
                        <img src="./../../../static/img/index/kangkongyunshufuwu.png" alt="">
                        <div class="img_detail">
                          <p class="text_center">航空运输服务</p>
                       <!--  <div>
                            <nuxt-link to="./../transport/aviation?transType=1">直达</nuxt-link>
                            <nuxt-link to="./../transport/aviation?transType=2">中转</nuxt-link>
                        </div> -->
                      </div>
                    </li>
                    <li>
                        <img src="./../../../static/img/index/hailuyunshufuwu.png" alt="">
                        <div class="img_detail">
                        <p>海路运输服务</p>
                        <div>
                          <nuxt-link to="./../transport/seaway?transType=5" style="margin: 0 18px;">整箱</nuxt-link>
                          <nuxt-link to="./../transport/seaway?transType=4" style="margin: 0 18px;">拼箱</nuxt-link>
                          <nuxt-link to="./../transport/seaway?transType=6" style="margin: 0 18px;">散杂</nuxt-link>
                        </div>
                      </div>
                    </li>
                  </ul>
              </a-tab-pane>
              <a-tab-pane tab="特色物流服务" key="2" forceRender>
                  <ul>
                      <li>
                          <img src="./../../../static/img/index/kuajingwuliu.png" alt="">
                          <div class="img_detail">
                              <p class="text_center"><nuxt-link to="/special/crossborder">跨境物流服务</nuxt-link></p >
                             <!--  <div>
                                  <nuxt-link to="./../special/crossborder">进口</nuxt-link>
                                  <nuxt-link to="./../special/crossborder">出口</nuxt-link>
                              </div> -->
                          </div>
                      </li>
                      <li>
                          <img src="./../../../static/img/index/chengshipeisong.png" alt="">
                          <div class="img_detail">
                                <p class="text_center"><nuxt-link to="/special/delivery">城市配送服务</nuxt-link></p >
                               <!--  <div>
                                    <nuxt-link to="./../special/delivery">同城</nuxt-link>
                                    <nuxt-link to="./../special/delivery">城际</nuxt-link>
                                </div> -->
                          </div>
                      </li>
                      <li>
                          <img src="./../../../static/img/index/nongcunwuliu.png" alt="">
                          <div class="img_detail">
                                <p class="text_center"><nuxt-link to="/special/village">农村物流服务</nuxt-link></p>
                                <!-- <div>
                                    <nuxt-link to="./../special/village">整车</nuxt-link>
                                    <nuxt-link to="./../special/village">零担</nuxt-link>
                                    <nuxt-link to="./../special/village">冷链</nuxt-link>
                                </div> -->
                          </div>
                      </li>
                      <li>
                          <img src="./../../../static/img/index/dianshang.png" alt="">
                          <div class="img_detail">
                                <p class="text_center"><nuxt-link to="/special/retailers">电商物流服务</nuxt-link></p>
                                <!-- <div>
                                    <nuxt-link to="./../special/retailers">整车</nuxt-link>
                                    <nuxt-link to="./../special/retailers">零担</nuxt-link>
                                    <nuxt-link to="./../special/retailers">冷链</nuxt-link>
                                </div> -->
                          </div>
                      </li>
                  </ul>
              </a-tab-pane>
              <a-tab-pane tab="绿色食品供应链服务" key="3">
                  <ul style="width: 921px;margin: 0 auto;">
                   <!--  <li>
                        <img src="./../../../static/img/index/chanpintigongzhe.png" alt="">
                        <div class="img_detail">
                              <p><nuxt-link to="./../chain">产品供应</nuxt-link></p>
                        </div>
                    </li> -->
                    <li>
                        <img src="./../../../static/img/index/wuliu.png" alt="">
                        <div class="img_detail">
                              <p class="text_center"><nuxt-link to="./../chain/sellOffer">绿色食品供应信息</nuxt-link></p>
                              <!-- <div>
                                  <nuxt-link to="./../chain/sellOffer">整车</nuxt-link>
                                  <nuxt-link to="./../chain/sellOffer">零担</nuxt-link>
                                  <nuxt-link to="./../chain/sellOffer">冷链</nuxt-link>
                              </div> -->
                        </div>
                    </li>
                    <li class="p_center">
                        <img src="./../../../static/img/index/chengshipeisong.png" alt="">
                        <div class="img_detail">
                              <p class="text_center"><nuxt-link to="./../chain/buyOffer">绿色食品采购信息</nuxt-link></p>
                              <!-- <div>
                                  <nuxt-link to="./../chain/sellOffer">整车</nuxt-link>
                                  <nuxt-link to="./../chain/sellOffer">零担</nuxt-link>
                                  <nuxt-link to="./../chain/sellOffer">冷链</nuxt-link>
                              </div> -->
                        </div>
                    </li>
                    <li>
                        <img src="./../../../static/img/index/xiaoshouzhongduan.png" alt="">
                        <div class="img_detail">
                              <p class="text_center"><nuxt-link to="./../chain/purchaser">供应链服务商</nuxt-link></p>
                              <!-- <div>
                                <nuxt-link to="./../chain/sellOffer">整车</nuxt-link>
                                <nuxt-link to="./../chain/sellOffer">零担</nuxt-link>
                                <nuxt-link to="./../chain/sellOffer">冷链</nuxt-link>
                              </div> -->
                        </div>
                    </li>
                  </ul>
              </a-tab-pane>
              <a-tab-pane tab="物流信息服务" key="4">
                  <ul>
                    <li>
                        <img src="./../../../static/img/index/cehyuanxinxi.png" alt="">
                        <div class="img_detail">
                              <p class="text_center"><nuxt-link to="./../info/vehicle">车源信息</nuxt-link></p>
                              <!-- <div>
                                  <nuxt-link to="./../info/vehicle">整车</nuxt-link>
                                  <nuxt-link to="./../info/vehicle">零担</nuxt-link>
                                  <nuxt-link to="./../info/vehicle">冷链</nuxt-link>
                              </div> -->
                        </div>
                    </li>
                    <li>
                        <img src="./../../../static/img/index/dianshang.png" alt="">
                        <div class="img_detail">
                              <p class="text_center"><nuxt-link to="./../info/goods">货源信息</nuxt-link></p>
                              <!-- <div>
                                  <nuxt-link to="./../info/goods">整车</nuxt-link>
                                  <nuxt-link to="./../info/goods">零担</nuxt-link>
                                  <nuxt-link to="./../info/goods">冷链</nuxt-link>
                              </div> -->
                        </div>
                    </li>
                    <li>
                        <img src="./../../../static/img/index/hetongwuliu.png" alt="">
                        <div class="img_detail">
                              <p class="text_center"><nuxt-link to="./../info/storage">仓储信息</nuxt-link></p>
                              <!-- <div>
                                  <nuxt-link to="./../info/vehicle">整车</nuxt-link>
                                  <nuxt-link to="./../info/vehicle">零担</nuxt-link>
                                  <nuxt-link to="./../info/vehicle">冷链</nuxt-link>
                              </div> -->
                        </div>
                    </li>
                    <li>
                        <img src="./../../../static/img/index/rencaifuwu.png" alt="">
                        <div class="img_detail">
                              <p class="text_center"><nuxt-link to="./../info/interInformation">物流咨讯</nuxt-link></p>
                              <!-- <div>
                                  <nuxt-link to="./../info/vehicle">整车</nuxt-link>
                                  <nuxt-link to="./../info/vehicle">零担</nuxt-link>
                                  <nuxt-link to="./../info/vehicle">冷链</nuxt-link>
                              </div> -->
                        </div>
                    </li>
                  </ul>
              </a-tab-pane>
          </a-tabs>
    </div>
</template>
<script>
export default {
    data() {
      return {
      }
    },
    beforeCreate() {
    },
    created() {
    },
    watch: {},

    mounted: function() {

    },
    methods: {

    }
  }
</script>
<style lang="scss" >
@p_center{
    line-height:280px;
}

</style>